<template>
  <div class="authority">
    闲置信息
  </div>
</template>
<script setup>
import {
  getUserList,
} from '@/api/user'
import ExportExcel from '@/components/exportExcel/exportExcel.vue'
import { reactive, ref, onMounted } from 'vue'
import { useAppStore } from "@/pinia";
import { useUserStore } from '@/pinia/modules/user'
import { ElMessage, ElMessageBox, useFormItem } from 'element-plus'
import { Edit, CirclePlus, Upload,CircleCheck } from '@element-plus/icons-vue'

// 通过该函数，可以获取组件当前所在的表单项formItem
const { formItem } = useFormItem()

defineOptions({
  name: 'Yygl'
})
const zjList = ref(['本级区域', '市级区域', '区级区域'])

const appStore = useAppStore()
const activeName = ref('1')
const searchInfo = ref({
  name: '',
  type: ''
})
const form = ref({
  names: '',
  zj: '',
  name:'',
  type:1
})
function search(){
  getUserList({name:form.value.name}).then(res => {
    userData.value = res.result.data
  })
}
function reset(){
  getUserList().then(res => {
    userData.value = res.result.data
  })
}
const userStore = useUserStore()
const page = ref(1)
const total = ref(0)
const pageSize = ref(10)
const dialogFormVisible = ref(false)

const yyglForm = ref(null)

const checkedColumns = ref(['序号', '办公楼名称', '详细地址', '总建筑面积', '总层数', '出租单位', '出租面积'])

if (localStorage.getItem('columnData') && JSON.parse(localStorage.getItem('columnData')).czcj) {
  checkedColumns.value = JSON.parse(localStorage.getItem('columnData')).czcj
}
const columns = ref(['序号', '办公楼名称', '详细地址', '总建筑面积', '总层数', '出租单位', '出租面积'])
const handleColumnsChange = (val) => {
  let obj = {

  }
  if (localStorage.getItem('columnData')) {
    obj = JSON.parse(localStorage.getItem('columnData'))
  }
  obj.czcj = val
  localStorage.setItem('columnData', JSON.stringify(obj))
}
const active = ref(0)
const tableData = ref([
  {
    name: '审批人',
    names: []
  }
])
// 查询
const getTableData = async () => {
  const res = await getApplicationList({
    pageNumber: page.value,
    pageSize: pageSize.value,
    ...searchInfo.value
  })
  if (res.code == 200) {
    tableData.value = []
    total.value = res.result.total
  }
}
// getTableData()
const userData = ref([])
onMounted(() => {
  getUserList().then(res => {
    userData.value = res.result.data
  })
})
const dialog2 = ref(false)
const table = ref(null)
function handleClose2(){
   //table.value.clearSelection()
  dialog2.value=false
}
function closeDialog2(){
  //table.value.clearSelection()
  dialog2.value=false
}
function confirm2(){
  //table.value.clearSelection()
  dialog2.value=false
}
const props1 = {
  checkStrictly: true,
  label: 'name',
  value: 'name'
}
const dialog1 = ref(false)
const handleClose = () => {
  form.value.names=''
  form.value.zj=''
  form.value.type=1
  dialogFormVisible.value = false
}
const currentIndex = ref(0)
function openDialog(index) {
  currentIndex.value = index
  dialogFormVisible.value = true
}
function closeDialog() {
   form.value.names=''
  form.value.zj=''
  form.value.type=1
  dialogFormVisible.value = false
}
function confirm() {
   
  dialogFormVisible.value = false
  tableData.value[currentIndex.value].names = form.value.names.split(',')
  form.value.names=''
  form.value.zj=''
  form.value.type=1
}

function addProcess() {
  if (active.value++ > 2) active.value = 0
  tableData.value.push(
    {
      name: '审批人',
      names: []
    }
  )
}

function openUser(){
  dialog2.value=true
  table.value?.clearSelection()
}
function handleSelectionChange(val){
  form.value.names = val.map(item=>item.name).join(',')
}
</script>

<style lang="scss">
.gva-btn-list {
  display: flex;
  justify-content: space-between;
}

.ant-alert-info {
  display: flex;
  justify-content: end;
  align-items: center;
  background-color: #e6f7ff;
  border: 1px solid #91d5ff;
  color: #1890ff;
  padding: 5px;

  .anticon {
    display: flex;
    align-items: center;
    cursor: pointer;
  }
}

.renyuan-drawer {
  .top {
    display: flex;
    align-items: center;
    margin-bottom: 20px;


    .el-form-item {
      margin-bottom: 0;
      margin-left: 10px;
    }
  }

  .section-title {
    font-weight: bold;
    font-size: 20px;
    line-height: 33px;
    padding: 4px 0 4px 14px;
    color: #4E7DFD;
    position: relative;

    .tips {
      margin: 0 50px 0 10px;
      font-weight: normal;
      font-size: 16px;
      color: #606266;

      span {
        color: #4E7DFD;
      }
    }
  }

  .section-title:before {
    content: '';
    position: absolute;
    top: 12px;
    left: 0;
    width: 6px;
    height: 14px;
    border-radius: 3px;
    background: #4E7DFD;
  }

  .title {
    font-weight: bold;
    font-size: 20px;
    text-align: center;
  }
}
.green{
  color: #67c23a;
}
.gray{
  color: #000;
}
</style>
